<%--
  Created by IntelliJ IDEA.
  User: admin
  Date: 2021/4/21
  Time: 9:22
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<html>
<head>
    <title>学生主页</title>
    <link rel="stylesheet" href="/jkd/plugins/layui/css/layui.css">
    <link rel="stylesheet" href="/jkd/plugins/bootstrap/css/bootstrap.min.css">
</head>
<body>
<div class="layui-container" >
    <div class="row" style="background-color: #FAFAFA">
    <div class="row">
        <div class="layui-col-md12" style="height: 52px">
            <%@include file="../nav/nav.jsp"%>
        </div>

    </div>
    <div class = "row">
        <div class="layui-col-md3" style="height: 600px;width: 200px">
        <%@include file="../nav/sideNav.jsp"%>
            <%@include file="../common/carousel.jsp"%>
        </div>
        <div class="layui-col-md1"style="height: 600px">
        </div>
        <div class="layui-col-md8" style="height: 50px;margin-top: 10px">
            <div class = "layui-col-md2" style="margin-right: 10px">
                <select id="buildingId" class="form-control" >
                <option value="">楼栋号</option>
                <c:forEach items="${buildingList}" var="b">
                    <option <c:if test="${building == b.buildingId}">selected</c:if>  value="${b.buildingId}" >  ${b.buildingName}</option>
                </c:forEach>
                </select>
            </div>

            <div class = "layui-col-md2" style="margin-right: 10px">
                <select id="roomNum" class="form-control" >
                    <option value="">房间号</option>
                    <c:forEach items="${roomNumList}" var="r">
                        <option <c:if test="${roomNum == r}">selected</c:if> value="${r}">${r}</option>
                    </c:forEach>
                </select>
            </div>

            <div class = "layui-col-md2" style="margin-right: 10px" >
                <select id="capacity" class="form-control" >
                    <option value="">容量</option>
                    <c:forEach items="${capacityList}" var="c">
                    <option <c:if test="${capacity == c}">selected</c:if> value="${c}">${c}</option>
                    </c:forEach>
                </select>
            </div>

            <div class = "layui-col-md2" style="margin-right: 10px">
                <select id="statusId" class="form-control" >
                    <option value="">可选状态</option>
                    <option value="1" <c:if test="${statusId == '1'}">selected</c:if>> 是</option>
                    <option value="0" <c:if test="${statusId == '0'}">selected</c:if>> 否</option>
                </select>
            </div>
            <div class = "layui-col-md2" >
                <button type="button" class="btn btn-info" style="width: 100px" onclick="search_info()" >查询</button>
            </div>

        </div>
        <div class="layui-col-md8" >
            <div class="row">
                <c:forEach items="${roomInfo.list}" var="r">
                <div class="col-sm-6 col-md-4">
                    <div class="thumbnail">
                        <img src="http://localhost:80/doc/${r.other1}"
                             alt="通用的占位符缩略图" style="height: 176px">
                        <div class="caption">
                            <h3>${r.other2}-${r.roomNum}</h3>
                            <p>已住人数为:${r.occupied}</p>
                            <p>宿舍容量为:${r.capacity}</p>
                            <p>
                                <a href="#" class="btn btn-primary" role="button"  onclick="stu_detil(${r.roomId})"  >
                                    查看详情
                                </a>
                                <a href="#" class="btn btn-default" role="button" onclick="checkIn(${r.roomId})">
                                    入住宿舍
                                </a>
                            </p>
                        </div>
                    </div>
                </div>
                </c:forEach>
        </div>
            <%@include file="../common/page.jsp"%>
        </div>


<%--        <!-- 模态框（Modal） -->--%>
<%--        <div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">--%>
<%--            <div class="modal-dialog">--%>
<%--                <div class="modal-content">--%>
<%--                    --%>
<%--                    <div class="modal-footer">--%>
<%--                        <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>--%>
<%--                    </div>--%>
<%--                </div><!-- /.modal-content -->--%>
<%--            </div><!-- /.modal -->--%>
<%--        </div>--%>


<%--    </div>--%>
<%--    </div>--%>

<%--</div>--%>


<script src="/jkd/plugins/jquery/jquery.min.js"></script>
<script src="/jkd/plugins/bootstrap/js/bootstrap.min.js"></script>
<script src="/jkd/plugins/layui/layui.js"></script>

<script>

   function search_info() {
    let buildingId = document.getElementById("buildingId").value;
    let roomNum = document.getElementById("roomNum").value;
    let capacity = document.getElementById("capacity").value;
    let statusId = document.getElementById("statusId").value;

    window.location = "/jkd/service/student/index?buildingId="+buildingId+"&roomNum="+roomNum+"&capacity="+capacity+"&statusId="+statusId+"&count=1";
   }

   function checkIn(roomId) {
       $.post('/jkd/service/doc/checkIn',{"roomId":roomId},function (data) {
       console.log(data);
       if(data.code == "200"){
           alert("入住成功");
       }else if(data.code == "500"){
           alert("入住失败");
       }

       })
   }
  // $(function () {
  //   $("#conFull").load("/jkd/service/doc/detail");
  // });

   // ajax 异步
   function stu_detil(roomId) {
       window.location = "/jkd/service/doc/detail?roomId="+roomId;
     // $.post("/jkd/service/doc/detail",{"roomId":roomId},function (data) {
     //     let msg = data.result;
     //     console.log(msg);
     //     let str ="";
     //   for(let i=1;i<msg.length;i++){
     //       str+="<tr>"+"<td>" +msg[i].stuId + "</td>" +
     //       "<td>" + msg[i].other1+ "</td>";
     //   }
     //   $("#result").innerHTML = str;
     //   $("#myModal").modal('show');
     // })

      // $("#myModal").modal('show');
   }



</script>
</body>
</html>
